// 本组件用于在 非组件文件 中，使用antd的message进行内容提示（如：全局axios定义文件）
// 在非组件形式文件中，通过 redux 通知此组件，实现目的
import store, { RootState } from '@/store';
import { saveMessageInfo } from '@/store/slice/message';
import { App } from 'antd';
import { useEffect } from 'react';
import { useSelector } from 'react-redux';

function MessageAlert() {
  const { message: messageApi } = App.useApp();
  const messageInfo = useSelector((state: RootState) => state.message.messageInfo);

  useEffect(() => {
    const { type, content } = messageInfo;

    if (messageApi && content) {
      switch (type) {
        case 'success':
          messageApi.success(content);
          break;
        case 'error':
          messageApi.error(content);
          break;
        case 'warning':
          messageApi.warning(content);
          break;
        case 'info':
          messageApi.info(content);
          break;
        default:
          messageApi.error(content);
          break;
      }

      // 提示完成后，将提示信息清空（防止微服务重新进入界面时，重复提示）
      store.dispatch(saveMessageInfo({ type: 'error', content: '' }));
    }
  }, [messageApi, messageInfo]);

  return null;
}

export default MessageAlert;
